@import (reference) "variables.less";

.dropdown-menu {
    &.mod_translation_menu-has-icons {
        > li > a {
            padding-left: 40px;
            position: relative;

            .glyphicon {
                @_height: 18px + 2 * 3px; // line-height + padding
                @_icon_height: 13px; // icon font size
                position: absolute;
                left: 10px;
                top: 0;
                bottom: 0;
                line-height: @_height;
            }
        }
    }
}

/* Admin pages */

.mod_translation-warning {
    color: #D84315;
}

/* List */

.mod_translation-filter {
    margin: 0 0 1rem 0;
}

.mod_translation-language-list h3,
.mod_translation-language-list h4 {
    font-weight: normal;
    margin: 0;
}
.mod_translation-language-list h3 {
    font-size: 1.1em;
    line-height: 1.3;
    color: #000;
}
.mod_translation-language-list h4 {
    font-size: 1em;
    line-height: 1.3;
    margin-top: .2em;
}
.mod_translation-language-list .mod_translation-codes {
    padding-right: 2em; /* make room for arrow */
}
.mod_translation-language-list .mod_translation-code {
    margin-right: .3em;
    color: rgb(145, 145, 145);
}
.mod_translation-language-list .fa-chevron-right {
    color: #ccc;
    height: 12px;
    width: 16px;
    text-align: right;
    display: inline-block;
    position: absolute;
    top: 50%;
    right: 10px;
    margin-top: -6px;
    margin-left: 0;
}
.mod_translation-language-list .mod_translation-added {
    color: #00ab6b; /* light green */
}

/* Detail */

#mod_translation_details_back {
    display: inline-block;
    margin-bottom: 1.5rem;
}
.mod_translation-language-detail {
    margin-bottom: 1rem;
}
.mod_translation-language-detail h4 {
    margin: .5rem 0 1rem 0;
}
.mod_translation-language-detail p {
    color: rgb(145, 145, 145);
}
.mod_translation-language-detail h4,
.mod_translation-language-detail table,
.mod_translation-language-detail p {
    width: 80%;
}
.mod_translation-language-detail table {
    margin: .5rem 0;
}
.mod_translation-language-detail p {
    margin: 1rem 0;
}
.mod_translation-language-detail table td {
    padding: .3rem 1.5rem .3rem 0;
    width: 50%;
    font-size: 1em;
    line-height: 1.3;
}
.mod_translation-language-detail table td:first-child {
    color: rgb(145, 145, 145);
}
.mod_translation-language-detail .mod_translation-added,
.mod_translation-language-detail .mod_translation-attention {
    color: #00ab6b; /* light green */
}
.mod_translation-language-detail .mod_translation-code {
    margin-right: .5rem;
}
.mod_translation-language-detail h5 {
    font-size: 1em;
    line-height: 1.3;
    margin-top: .5rem;
}
.mod_translation-add-button {
    margin-top: -0.5rem;
}

/* Status */

@_color_0: #fc5830; // red
@_color_25: #fc5830; // red
@_color_50: #fd9727; // orange
@_color_75: #cdda49; // lime
@_color_100: #1ec659; // green

.mod_translation-status-table {}

.mod_translation-status-title {
    white-space: nowrap;
    padding-right: 8rem !important;
}

.mod_translation-status-perc {
    width: 8%;
    font-size: 11px;
    color: #bbb;
}
.mod_translation-status-perc .mod_translation-status-bar {
    height: 4px;
    background: #666;
    width: 4px;
    margin: 4px 0;
}
.mod_translation-status-perc .mod_translation-status-bar-hidden {
    visibility: hidden;
}
.mod_translation-status-perc .mod_translation-status-count {
    color: #777;
}

.mod_translation-status-perc-0 {
    .mod_translation-status-bar {background-color: @_color_0;}
}
.mod_translation-status-perc-25 {
    .mod_translation-status-bar {background-color: @_color_25;}
}
.mod_translation-status-perc-50 {
    .mod_translation-status-bar {background-color: @_color_50;}
}
.mod_translation-status-perc-75 {
    .mod_translation-status-bar {background-color: @_color_75;}
}
.mod_translation-status-perc-100 {
    .mod_translation-status-bar {background-color: @_color_100;}
}


